模块热替换

简单说来,就是在不刷新浏览器下的情况下,动态更新修改的内容。

这里以css样式举例,服务器是webpack-dev-server,具体参见《开发环境》一章。

首先安装style-loader和css-loader,具体参见《资源管理》一章。

修改webpack.config.js文件:

//新增

var webpack = require('webpack');

devServer:{
    hot:true
}

plugins:[new webpack.HotModuleReplacementPlugin()]

这样,在入口文件引入一个css文件,动态修改css文件,页面不刷新也是可以更新的。

通关浏览器控制台可以看到,热替换css是通过动态插入js文件,该文件修改style来实现的。

results matching ""

    No results matching ""